<template>
<div class="">
    <div class="pr10">
        <div class="analyItem">
            <p class="analyItemTit tx-center">状态</p>
            <div class="analyItemCon">
                <p class="col-md-6">
                    <el-date-picker value-format="yyyy-MM" v-model="currDate" type="month" placeholder="选择月" @change="orderStatistics()"></el-date-picker>
                </p>
                <p class="col-md-6">
                    <span class="cLightGray pr8 fl">任务状态</span>
                    <select class="fl width120" v-model="taskstatus" @change="orderStatistics()">
                        <option value="3">进行中</option>
                        <option value="5">待审批</option>
                        <option value="6">完结可继续</option>
                    </select>
                </p>
            </div>
        </div>
        <!-- <div class="analyItem">
            <p class="analyItemTit tx-center">统计</p>
            <div class="analyItemCon">
                <el-radio-group  v-model="orderTitle" @change="orderStatistics()">
                    <el-radio-button label="1">管理</el-radio-button>
                    <el-radio-button label="2">司统计</el-radio-button>
                    <el-radio-button label="3">分司</el-radio-button>
                </el-radio-group>
            </div>
        </div> -->
    </div>
    <div class="thinScroll pr10" v-scrollHeight="84">
        <!-- <template v-if="orderTitle==='1'">
            <div class="analyItem" v-for='(item,index) in orderList' :key="index">
                <p class="analyItemTit tx-center">{{item.departmentName}}</p>
                <div class="analyItemCon">
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">执行中</span>
                        <span class="pr8">{{item.executingOrderNum?item.executingOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">待验收</span>
                        <span class="pr8">{{item.waitingForAcceptOrderNum?item.waitingForAcceptOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">已完成</span>
                        <span class="pr8">{{item.complatedOrderNum?item.complatedOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">实收金额</span>
                        <span class="pr8">{{item.factIncome?item.factIncome:0}}</span>
                    </p>
                </div>
            </div>
        </template> -->
        <!-- <template v-if="orderTitle==='2'">
            <div class="analyItem" v-for='(item,index) in orderList' :key="index">
                <p class="analyItemTit tx-center">{{item.departmentName}}</p>
                <div class="analyItemCon">
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">执行中</span>
                        <span class="pr8">{{item.executingOrderNum?item.executingOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">待验收</span>
                        <span class="pr8">{{item.waitingForAcceptOrderNum?item.waitingForAcceptOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">已完成</span>
                        <span class="pr8">{{item.complatedOrderNum?item.complatedOrderNum:0}}</span>
                    </p>
                    <p class='col-md-3'>
                        <span class="cLightGray pr8">实收金额</span>
                        <span class="pr8">{{item.factIncome?item.factIncome:0}}</span>
                    </p>
                </div>
            </div>
        </template> -->
        <template v-if="orderTitle==='3'">
            <router-link exact class="analyItem anItemBor" active-class="anItemBor-active" v-for='(item,index) in orderList' :key="index" :to="{path:routerPath('orderOrder'),query:{type:index}}">
                <p class="analyItemTit tx-center">{{item.type}}</p>
                <div class="analyItemCon">
                    <p class="col-md-4">
                        <span class="cLightGray" v-if='item.type' v-text="item.type"></span>
                        <span class="cLightGray" v-else> - </span>
                    </p>
                    <p class="col-md-4">
                        <span class="cLightGray pr8">订单</span>
                        <span class="cLightGray" v-if='item.orderNum' v-text="item.orderNum"></span>
                        <span class="cLightGray" v-else>0</span>
                    </p>
                    <p class="col-md-4">
                        <span class="cLightGray pr8">实收</span>
                        <span class="cLightGray" :class="{'cRed':item.totalIncome<0,'cGreen':item.totalIncome>=0}" v-if='item.totalIncome' v-text="item.totalIncome"></span>
                        <span class="cLightGray" v-else>0</span>
                    </p>
                </div>
            </router-link>
        </template>
    </div>
    <div class="pr10">
        <router-link tag="div" :to="routerPath('orderProcessing')" class="analyItem anItemBor" active-class="anItemBor-active">
            <p class="analyItemTit tx-center">处理</p>
            <div class="analyItemCon">

            </div>
        </router-link>
    </div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import {orderStatistics} from '../Resources/Api'
export default {
    data () {
        return {
            currDate: '',
            taskstatus: 3,
            orderTitle: '3',
            orderList: []
        }
    },
    computed: {
        ...mapGetters([ 'leftInfo' ])
    },
    created () {
        this.initCurrDate()
        this.orderStatistics()
    },
    methods: {
        initCurrDate () {
            let year = new Date().getFullYear()
            let month = new Date().getMonth() + 1
            if (month <= 9) {
                month = '0' + month
            }
            this.currDate = year + '-' + month
        },
        orderStatistics () {
            orderStatistics({
                monthAndYear: this.currDate,
                statisticsType: this.orderTitle,
                region: this.leftInfo.u_diqu,
                orderStage: this.taskstatus
            }).then(results => {
                if (!results.data.Body) {
                    return
                }
                this.orderList = results.data.Body
            })
        },
        // 路由跳转路径拼接
        routerPath (path) {
            return this.$route.matched[1].path + '/' + path
        },
        // 直接进行路由跳转路径
        routerPush (path) {
            this.$router.push(this.$route.matched[1].path + '/' + path)
        }
    },
    watch: {
        leftInfo () {
            this.initCurrDate()
            this.orderStatistics()
        }
    }
}
</script>

